<template>
    <div class="comment">
        <h3 class="title">发表评论</h3>
    <hr>
        <textarea placeholder="请输入评论内容（最多输入120字）" maxlength="120" ></textarea>
        <mt-button type="primary" size="large" >发表评论</mt-button>
        <div class="cmt-list">
            <div class="cmt-item">
            <div class="cmt-title">
                <span>第一楼&nbsp;&nbsp;用户:匿名用户</span><span>发表时间：2018-10-11 15:30:30</span>
            </div>
            <div class="cmt-body">
                高级虎门
            </div>
            </div>
            <div class="cmt-item">
                <div class="cmt-title">
                    <span>第一楼&nbsp;&nbsp;用户:匿名用户</span><span>发表时间：2018-10-11 15:30:30</span>
                </div>
                <div class="cmt-body">
                    高级虎门
                </div>
            </div>
            <div class="cmt-item">
                <div class="cmt-title">
                    <span>第一楼&nbsp;&nbsp;用户:匿名用户</span><span>发表时间：2018-10-11 15:30:30</span>
                </div>
                <div class="cmt-body">
                    高级虎门
                </div>
            </div>
        </div>
        <mt-button type="default" size="large" plugin>加载更多</mt-button>
    </div>
</template>

<script>
    export default {
        name: "comment",
        props:["id"]
    }
</script>

<style scoped lang="scss">
.comment{
    .title{
        font-size:16px;
    }
    textarea{
        font-size: 14px;
        margin: 0;
    }
    mt-button{
        margin: 0 auto;
    }
    .cmt-list{
        .cmt-item{
            margin: 5px 0 3px;
            font-size: 13px;
            .cmt-title{
                line-height: 30px;
                background: #ccc;
                display: flex;
                justify-content: space-between;
            }
            .cmt-body{
                line-height: 35px;
                text-indent: 2em;//缩进
            }
        }
    }
}
</style>